"use client"

import { ColumnDef } from "@tanstack/react-table"
import { Button } from "@/components/ui/button"
import { MoreHorizontal, Pencil, Trash2, DoorOpen, MapPin, Settings, Calendar } from "lucide-react"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { Access } from "@/types/admin"
import StatusBadge from "@/components/status-badge"

interface ColumnActionsProps {
  onEdit: (access: Access) => void
  onDelete: (access: Access) => void
}

export const columns = ({ onEdit, onDelete }: ColumnActionsProps): ColumnDef<Access>[] => [
  {
    accessorKey: "id",
    header: "ID",
    cell: ({ row }) => (
      <div className="font-mono text-xs">{row.getValue("id")}</div>
    ),
  },
  {
    accessorKey: "name",
    header: "门禁名称",
    cell: ({ row }) => (
      <div className="font-medium flex items-center">
        <DoorOpen className="h-4 w-4 mr-2 text-primary" />
        {row.getValue("name")}
      </div>
    ),
  },
  {
    accessorKey: "location",
    header: "位置",
    cell: ({ row }) => (
      <div className="flex items-center">
        <MapPin className="h-4 w-4 mr-2 text-muted-foreground" />
        {row.getValue("location")}
      </div>
    ),
  },
  {
    accessorKey: "type",
    header: "类型",
    cell: ({ row }) => {
      const type = row.getValue("type") as string
      return (
        <StatusBadge status="default" className="flex items-center">
          <Settings className="h-3 w-3 mr-1" />
          {type}
        </StatusBadge>
      )
    },
  },
  {
    accessorKey: "track",
    header: "关联股道",
    cell: ({ row }) => {
      const track = row.original.track
      if (!track) {
        return <StatusBadge status="default">无关联股道</StatusBadge>
      }

      return (
        <StatusBadge status="primary">
          {track.name} ({track.code})
        </StatusBadge>
      )
    },
  },
  {
    accessorKey: "status",
    header: "状态",
    cell: ({ row }) => {
      const status = row.getValue("status") as string
      let statusVariant: "normal" | "warning" | "error" = "normal"
      
      if (status === "故障") {
        statusVariant = "error"
      } else if (status === "维护中") {
        statusVariant = "warning"
      }
      
      return (
        <StatusBadge status={statusVariant}>
          {status}
        </StatusBadge>
      )
    },
  },
  {
    accessorKey: "lastMaintenance",
    header: "最近维护时间",
    cell: ({ row }) => (
      <div className="flex items-center text-sm text-muted-foreground">
        <Calendar className="h-3 w-3 mr-1" />
        {row.getValue("lastMaintenance")}
      </div>
    ),
  },
  {
    id: "actions",
    cell: ({ row }) => {
      const access = row.original

      return (
        <DropdownMenu>
          <DropdownMenuTrigger asChild>
            <Button variant="ghost" className="h-8 w-8 p-0 rounded-full hover:bg-muted">
              <span className="sr-only">打开菜单</span>
              <MoreHorizontal className="h-4 w-4" />
            </Button>
          </DropdownMenuTrigger>
          <DropdownMenuContent align="end" className="rounded-lg card-shadow">
            <DropdownMenuLabel>操作</DropdownMenuLabel>
            <DropdownMenuItem 
              onClick={() => onEdit(access)}
              className="cursor-pointer flex items-center"
            >
              <Pencil className="mr-2 h-4 w-4" />编辑
            </DropdownMenuItem>
            <DropdownMenuItem
              className="text-destructive cursor-pointer flex items-center"
              onClick={() => onDelete(access)}
            >
              <Trash2 className="mr-2 h-4 w-4" />删除
            </DropdownMenuItem>
          </DropdownMenuContent>
        </DropdownMenu>
      )
    },
  },
] 